import React, { useState, useEffect } from "react"
import service from "@@/services/user.service"
import { BaseEventOrig, Image, Picker, Text, View } from "@tarojs/components"
import {
    useDidHide,
    useDidShow,
    usePageScroll,
    usePullDownRefresh,
    useReachBottom,
    useReady,
    useResize,
    useTabItemTap,
    navigateTo,
    Current
} from "@tarojs/taro"
import NavLayout from "@@/components/layout/nav.layout"
import TBread from "@@/t-ui/bread.tui"
import { productListResType, productType } from "@@/interfaces/api.interface"
import ProxyConfig from "@@/../config/proxy"
import "./productList.scss"

type breadType = {
    name: string | undefined
}

const Index = () => {
    const [productList, setProductList] = useState<Array<productListResType<productType>>>()//
    const [breadList, setBreadList] = useState<breadType[]>([])
    useEffect(() => {
        setBreadList([
            { name: "SMB" },
            { name: decodeURI(Current.router?.params?.oneMenu || "") },
        ])
        let industryId = Number(Current.router?.params?.id)
        service.findProductList({ industryId }).then(res => {
            if (res.code === 200) {
                // console.log(res)
                setProductList(res.data)
            }
        })
    }, [])

    const goProduct = (id: string) => {
        navigateTo({
            url: `/pages/productDetail/productDetail?id=${id}&oneMenu=${breadList[1].name}`
        })
    }

    return (
        <NavLayout title={"大华股份"} border leftIconType="chevron-left" color="#141414" id="productListPage">
            <TBread breadList={breadList} />
            <View className={"list_box"}>
                {
                    productList && productList[0] && productList.map(item => {
                        return <View className={"item_box"} key={item.id} onClick={goProduct.bind(this, item.id)}>
                            <View className={'img_box'}><Image src={`${ProxyConfig.sourceUrl}/${item.image}`} /></View>
                            <View className={'content_box'}>
                                <View className={"title"}>{item.title}</View>
                                <View className={"detail"}>{item.introduction}</View>
                            </View>
                        </View>
                    })
                }
            </View>
        </NavLayout>
    )
}

export default Index